<template>
  <div style="padding: 10px">
    <!--    功能区域-->
    <div >


    </div>

    <!--    搜索区域-->
    <div style="margin: 10px 0">
      <el-input placeholder="请输入座位号查询" style="width: 20%" v-model="search" clearable></el-input>
      <el-button type="primary" style="margin-left: 5px" @click="load">搜索</el-button>
    </div>

    <el-table :data="tableData" stripe style="width: 100%">
      <el-table-column prop="id" label="ID" sortable></el-table-column>
      <el-table-column prop="seatNumber" label="座位号"></el-table-column>
      <el-table-column  prop="cleanstate"  label="打扫状态"></el-table-column>
      <el-table-column  prop="seatState"  label="可用状态"></el-table-column>
      <el-table-column  prop="member"  label="可用餐人数"></el-table-column>




      <el-table-column fixed="right" label="操作" width="130">
        <template #default="scope">


          <el-badge value="待打扫"  class="item" >
          <el-button  @click="handle(scope.row.id)"  type="primary">处理完成
          </el-button>
          </el-badge>
<!--          <span ><el-button @click="clean(scope.row.id)" style="margin-top: 5px" type="primary">保洁-->
<!--          </el-button></span>-->

<!--          <div style="margin-top: 6px">-->
<!--            <el-popconfirm title="请确保顾客完成用餐" @confirm="releaseSeat(scope.row.id)">-->
<!--              <template #reference>-->
<!--                <el-button type="danger"  >用餐完成</el-button>-->
<!--              </template>-->
<!--            </el-popconfirm>-->
<!--          </div>-->

        </template>
      </el-table-column>
    </el-table>
    <div style="margin: 10px 0">
      <div class="block">

        <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="currentPage"
            :page-sizes="[5, 10, 20]"
            :page-size="pageSize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="total"
        >
        </el-pagination>



      </div>
    </div>

  </div>
</template>
<style>
.item {
  margin-top: 10px;
  margin-right: 40px;
}
</style>
<script>


import request from "../../utils/request";

export default {
  name: 'ToClean',


  components: {},
  data() {
    return {

    seatlist:[],
     form: {},
      dialogVisible: false,
      search: '',
      currentPage: 1,
      pageSize:10,
      total: 0,
      tableData: []
    }
  },
  created(){
    this.load()
    this.$nextTick(() => {
      setInterval(this.load, 5000);
    });
 },
  methods: {

    load(){
      let name =  sessionStorage.getItem("user")


     let name1 =JSON.parse(name).nickname//转成字符串
      request.get("/cleaner/showSeat",{
        params:{
          pageNum:this.currentPage,
          pageSize:this.pageSize,
          search:this.search,
          cleanerName:name1
        }
      }).then(res =>{



        this.tableData = res.data.records
        this.total = res.data.total
      })





    },
    handle(id){
      if(confirm("确定打扫完成？")){
        request.put("/cleaner/handle/"+id).then(res =>{
              if( res.code ==='0'){

                this.$messageBox({

                  type:"success",
                  message:"打扫完成"
                })

              }else {
                this.$messageBox({

                  type:"error",
                  message:res.msg})
              }
            }
        )
      }

      this.load()


    },
    clean(id){
      request.put("/order/cleanSeat/" +id).then(res =>{
            if( res.code ==='0'){

              this.$messageBox({

                type:"success",
                message:"请求成功"
              })

            }else {
              this.$messageBox({

                type:"error",
                message:res.msg
              })
            }
          }

      )
      this.load()

    },

    handleChoose(id,seatNumber) {



      request.get("/order/" +id, {}).then(res1 =>{

        if(res1.data.seatState === 'false'){
          this.$message.error("座位正在使用")
          return
        }else if(res1.data.cleanstate!= '打扫完成'){
          this.$message.error("座位需要打扫")
          return

        }else {

          sessionStorage.setItem("seatNumber",JSON.stringify(seatNumber))//缓存座位号信息
          sessionStorage.setItem("seatid",JSON.stringify(id))

          this.$router.push("/goodsShow" )



        }



      })


    }, handleSizeChange( pageSize) { //改变页面显示信息个数
      this.pageSize = pageSize
      this.load()

    }, handleCurrentChange(pageNum) { //改变当前页
      this.currentPage = pageNum
      this.load()
    },


  }
}
</script>
